<template>
  <view class="main">
    <view class="ip-item">
      <input
        type="text"
        placeholder="置顶开关"
        disabled
        placeholder-class="ip"
      />
      <view>
        <van-switch
          active-color="#0753fd"
          inactive-color="#eeeeee"
          v-model="switchBool"
          @change="switchChange"
        />
      </view>
    </view>
    <view class="ip-item">
      <input
        type="text"
        placeholder="置顶审核"
        disabled
        placeholder-class="ip"
      />
      <view>
        <van-switch
          active-color="#0753fd"
          inactive-color="#eeeeee"
          v-model="audit"
        />
      </view>
    </view>
    <view
      class="dispaly-just-between"
      v-for="(s, k) in getRuleDatas"
      style="margin-bottom: 20rpx"
    >
      <view class="ip-item" style="width: 48%; margin-bottom: 0">
        <view class="text">{{ s?.name }}天</view>
      </view>
      <view class="ip-item" style="width: 48%">
        <view class="dispaly-just-between">
          <input
            type="text"
            placeholder=""
            placeholder-class="ip"
            style="color: #2352f4"
            v-model="s.value1"
          />
          <view>元</view>
        </view>
      </view>
    </view>
    <!-- <view class="dispaly-just-between" style="margin-bottom: 20rpx">
      <view class="ip-item" style="width: 48%; margin-bottom: 0">
        <view class="text">7天</view>
      </view>
      <view class="ip-item" style="width: 48%">
        <view class="dispaly-just-between">
          <input
            type="text"
            placeholder=""
            placeholder-class="ip"
            style="color: #2352f4"
          />
          <view>元</view>
        </view>
      </view>
    </view>
    <view class="dispaly-just-between" style="margin-bottom: 20rpx">
      <view class="ip-item" style="width: 48%; margin-bottom: 0">
        <view class="text">15天</view>
      </view>
      <view class="ip-item" style="width: 48%">
        <view class="dispaly-just-between">
          <input
            type="text"
            placeholder=""
            placeholder-class="ip"
            style="color: #2352f4"
          />
          <view>元</view>
        </view>
      </view>
    </view>
    <view class="dispaly-just-between" style="margin-bottom: 20rpx">
      <view class="ip-item" style="width: 48%; margin-bottom: 0">
        <view class="text">30天</view>
      </view>
      <view class="ip-item" style="width: 48%">
        <view class="dispaly-just-between">
          <input
            type="text"
            placeholder=""
            placeholder-class="ip"
            style="color: #2352f4"
          />
          <view>元</view>
        </view>
      </view>
    </view> -->

    <view>
      <view class="title-block dispaly-center">
        <view class="title-line"></view>
        <view class="title-text">推荐规则</view>
      </view>
      <view>
        <rich-text :nodes="detail"></rich-text>
      </view>
    </view>
    <view class="btns">
      <Button
        @clickButton="carete"
        :loading="loading"
        loading-text="保存中"
        text="保存"
      />
    </view>
  </view>
</template>

<script lang="ts" setup>
import { ref } from "vue";
import {
  getRule,
  createCircle,
  circleInfo,
  proxy,
  overhead,
} from "@/api/apiList";
import { onLoad } from "@dcloudio/uni-app";

const getProxy = async () => {
  const res = await proxy("recommend");
  if (res.code == 200) {
    console.log(res, "res");
    detail.value = res.data.recommend;
  }
};
getProxy();
// 推荐规则
const detail = ref(``);
const getIds = ref();
onLoad((e) => {
  if (e && e?.id) {
    getIds.value = e?.id;
    getRuleData(e?.id);
    getRuleInfo(e?.id);
  }
});

const getRuleInfoData = ref();
const getRuleInfo = async (getIds) => {
  const response = await circleInfo({ id: getIds });
  if (response && response?.code == 200) {
    getRuleInfoData.value = response?.data;
    switchBool.value = response?.data?.isOverhead == 0 ? false : true;
    audit.value =
      response?.data?.overheadCheck == 0 ||
      response?.data?.overheadCheck == null
        ? false
        : true;
  }
};

const switchBool = ref(true);
const audit = ref(true);

const loading = ref(false);
const carete = async () => {
  const response = await createCircle({
    rules: getRuleDatas.value,
    id: getIds.value,
    isOverhead: switchBool.value ? 1 : 0,
    overheadCheck: audit.value ? 1 : 0,
  });
  loading.value = true;
  if (response?.code == 200) {
    uni.showToast({
      title: "提交成功",
      icon: "none",
    });
    loading.value = false;
    setTimeout(() => {
      uni.navigateBack({ delta: 1 });
    }, 800);
  }
};

const switchChange = async (e) => {
  // const response = await overhead({ type: 2 });
  // if (response && response?.code == 200) {
  //   // switchBool.value
  // }
};

const getRuleDatas = ref([]);
const getRuleData = async (ids) => {
  const response = await getRule({ type: 2, circleId: ids });
  if (response && response?.code == 200) {
    getRuleDatas.value = response?.data;
  }
};
</script>

<style lang="scss" scoped>
.main {
  padding: 30rpx;
}

.ip {
  color: #000;
}

.btns {
  padding: 30rpx;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
}
</style>
